@extends('layouts.home.home_master')

@section('head') 
<link rel="stylesheet" href="{{ asset('home/css/jquery.jqzoom.css') }}" type="text/css">
<script src="{{ asset('home/js/jquery-1.7.2.min.js') }}" ></script>
<script src="{{ asset('home/js/html5.js') }}" ></script>
<script src="{{ asset('home/js/jflow.plus.js') }}" ></script>
<script src="{{ asset('home/js/jquery.carouFredSel-5.2.2-packed.js') }}"></script>
<script src="{{ asset('home/js/checkbox.js') }}"></script>
<script src="{{ asset('home/js/radio.js') }}"></script>
<script src="{{ asset('home/js/selectBox.js') }}"></script>
<script src="{{ asset('home/js/jquery.jqzoom-core.js') }}" ></script>
<script>
$(document).ready(function() {
	$('.jqzoom').jqzoom({
		zoomType: 'standard',
		lens:true,
		preloadImages: true,
		alwaysOn:false
	});
});
</script>

<script>
$(document).ready(function() {
	$("select").selectBox();
});
</script>

<script>
$(document).ready(function() {
	$('#wrapper_tab a').click(function() {
		if ($(this).attr('class') != $('#wrapper_tab').attr('class') ) {
			$('#wrapper_tab').attr('class',$(this).attr('class'));
		}
		return false;
	});
});
</script>

<script>
$(function() {
    // $('#list_product').carouFredSel({
    //     prev: '#prev_c1',
    //     next: '#next_c1',
    //     auto: false
    // });
    // $('#list_banners').carouFredSel({
    //     prev: '#ban_prev',
    //     next: '#ban_next',
    //     scroll: 1,
    //     auto: false
    // });
    $('#thumblist').carouFredSel({
        prev: '#img_prev',
        next: '#img_next',
        scroll: 1,
        auto: false,
        circular: false,
    });
    $(window).resize();
});
</script>
<script>
   // $(document).ready(function(){
   //    $("button").click(function(){
	  //    $(this).addClass('click')
   //    });
   // })
</script>
@endsection
@section('content')
<section id="main">
	<div class="container_12">
	    <div id="sidebar" class="grid_3">
	        <aside id="categories_nav">
	            <h3>分类</h3>
	            <nav class="left_menu">
	                <ul>
	                @foreach($categories as $cate)
	                	<li>
	                   		<a href="{{ url('/categories/'.$cate['product_category_id']) }}">
	                   		{{ $cate['name'] }} <span></span>
	                   		</a>
	                   	</li>
	                @endforeach
	                </ul>
	            </nav><!-- .left_menu -->
	        </aside><!-- #categories_nav -->
	    </div><!-- .sidebar -->

	    <div id="content" class="grid_9">
	    <h1 class="page_title">{{ $product['product_name'] }}</h1>

		<div class="product_page">
			<div class="grid_4 img_slid" id="products">
				<img class="sale" src="{{ asset('home/images/sale.png') }}" alt="Sale"/>
				<div class="preview slides_container">
					<div class="prev_bg">
						<a href="{{ asset('attachs/img/'.$product['photo']) }}" class="jqzoom" rel='gal1' title="">
							<img src="{{ asset('attachs/img/'.$product['photo']) }}"  title="" alt=""/>
						</a>
					</div>
				</div><!-- .prev -->

				<ul class="pagination clearfix" id="thumblist">
					<li>
	                    <a class="zoomThumbActive" href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: '{{ asset('attachs/img/'.$product['photo']) }}',largeimage: '{{ asset('attachs/img/'.$product['photo']) }}'}"><img src="{{ asset('attachs/img/'.$product['photo']) }}" alt="">
	                    </a>
	                </li>
					<li>
	                   <!--  <a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/produkt_slid4.png',largeimage: './images/produkt_slid4.png'}">
	                    <img src="{{ asset('home/images/produkt_slid4.png') }}" alt="">
	                    </a> -->
	                </li>
				</ul>

				<div class="next_prev">
					<a id="img_prev" class="arows" href="#"><span>Prev</span></a>
					<a id="img_next" class="arows" href="#"><span>Next</span></a>
				</div><!-- . -->
			</div><!-- .grid_4 -->

			<div class="grid_5">
				<div class="entry_content">
					<!-- <div class="review">
						<a class="plus" href="#"></a>
						<a class="plus" href="#"></a>
						<a class="plus" href="#"></a>
						<a href="#"></a>
						<a href="#"></a>
						<span>1 REVIEW(S)</span>
						<a class="add_review" href="#">ADD YOUR REVIEW</a>
					</div> -->
					<p>{{ $product['product_name'] }}</p>
					<div class="ava_price">
						<div class="availability_sku">
							<div class="sku">
								品牌: <span>{{ $product['brand'] }}</span>
							</div>
						</div><!-- .availability_sku -->

						<div class="price">
							@if(empty(Auth::user()->email)) 
							<div class="price_new">售价：***</div>
							@else 
							<div class="price_new">售价：{{ $product['price'] }}</div>
							@endif
							<!-- <div class="price_old">$725.00</div> -->
						</div><!-- .price -->
					</div><!-- .ava_price -->

					<div class="block_cart">
						<div class="cart">
							@if(empty(Auth::user()->email)) 
							<a class="bay" href="tel:13764567708">电话咨询</a>
							@else
							<a class="bay" href="tel:13764567708">电话咨询</a>
							@endif
							<input type="text" name="" class="number" value="99" readonly="true" />
							<span>库存:</span>
						</div>
						
						<div class="clear"></div>
					</div><!-- .block_cart -->
				</div><!-- .entry_content -->

			</div><!-- .grid_5 -->

			<div class="clear"></div>

			<div class="grid_9" >
				<div id="wrapper_tab" class="tab1">
					<a href="#" class="tab1 tab_link">商品详情</a>

					<div class="clear"></div>

					<div class="tab1 tab_body">
						{!! $product['description'] !!}
						<div class="clear"></div>
					</div><!-- .tab1 .tab_body -->
					<div class="clear"></div>
				</div>​<!-- #wrapper_tab -->
				<div class="clear"></div>
			</div><!-- .grid_9 -->

			<div class="clear"></div>

		</div><!-- .product_page -->
		<div class="clear"></div>

	   </div><!-- #content -->

	  <div class="clear"></div>
	</div><!-- .container_12 -->
</section><!-- #main -->
@endsection
